<html>
    <head>
        <title>SimpleTestWebApp</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <script src="./jain-sip.js" type="text/javascript"></script>      
        <script src="./SimpleWebRtcSipPhone.js" type="text/javascript" ></script>
        <script type='text/javascript'>	
            
            var simpleWebRtcSipPhone=null;
            var defaultSipWsUrl="ws://10.193.7.29:5082";
            var defaultSipDomain="test.com";
            var defaultSipDisplayName="1111";
            var defaultSipUserName="1111";
            var defaultSipLogin="1111@test.com";
            var defaultSipPassword="1234";
            var defaultSipContactPhoneNumber="2222";
            var defaultStunServer="";         
            
            var localAudioVideoMediaStream=null;
            
            function onLoad()
            {
                console.debug("onLoad");
                document.getElementById("stunServer").value=defaultStunServer;
                document.getElementById("sipWsUrl").value=defaultSipWsUrl;
                document.getElementById("sipDomain").value=defaultSipDomain;
                document.getElementById("sipDisplayName").value=defaultSipDisplayName;
                document.getElementById("sipUserName").value=defaultSipUserName;
                document.getElementById("sipLogin").value=defaultSipLogin;
                document.getElementById("sipPassword").value=defaultSipPassword;
                document.getElementById("sipContactPhoneNumber").value=defaultSipContactPhoneNumber;
                navigator.webkitGetUserMedia({audio:true, video:true},gotLocalAudioVideoStream, gotLocalAudioVideoFailed);
            }

            function onBeforeUnload()
            {
                unRegister();
                for(var i=0;i<5000;i++)
                {
                    console.log("OnBeforeUnLoad()");  
                }     
            }
            
            function gotLocalAudioVideoStream (localStream) {
                localAudioVideoMediaStream=localStream;
                var url = webkitURL.createObjectURL(localStream);
                document.getElementById("localVideoPreview").src=url;
                document.getElementById("localVideoPreview").play();
                showRegisterButton();
            }

            function  gotLocalAudioVideoFailed(error) 
            {
                alert("Failed to get access to local media. Error code was " + error.code + ".");
                hideRegisterButton();
            }	
    
            function register()
            {
                simpleWebRtcSipPhone=new SimpleWebRtcSipPhone(document.getElementById("sipWsUrl").value);
                simpleWebRtcSipPhone.localAudioVideoMediaStream=localAudioVideoMediaStream;
            }

            function unRegister()
            {
                if(simpleWebRtcSipPhone!=null)
                {
                    simpleWebRtcSipPhone.unRegister();   
                }
            }

            function call(from,to)
            {   
                simpleWebRtcSipPhone.call(from,to);
            }


            function bye()
            {
                simpleWebRtcSipPhone.bye();
            }
                
                
            function hideCallButton()
            {
                var call=document.getElementById("Call");
                call.disabled=true;
            }
            
            function showCallButton()
            {
                var call=document.getElementById("Call");
                call.disabled=false;
            }
            
            function hideByeButton()
            {
                var bye=document.getElementById("Bye");
                bye.disabled=true;
            }
            
            function showByeButton()
            {
                var bye=document.getElementById("Bye");
                bye.disabled=false;
            }
            
            function showUnRegisterButton()
            {
                var unRegister=document.getElementById("UnRegister");
                unRegister.disabled=false;
            }
            
            function showRegisterButton()
            {
                var register=document.getElementById("Register");
                register.disabled=false;
            }
            function hideUnRegisterButton()
            {
                var unRegister=document.getElementById("UnRegister");
                unRegister.disabled=true;
            }
            
            function hideRegisterButton()
            {
                var register=document.getElementById("Register");
                register.disabled=true;
            }
        </script>
        <style type='text/css'>
            div {
                border: 0px solid black;
            }

            div#input {
                clear: both;
                width: 36em;
                padding: 4px;
                background-color: #e0e0e0;
                border: 1px solid black;
            }

            div.hidden {
                display: none;
            }

            span.alert {
                font-style: italic;
            }
        </style>
    </head>
    <body onload="onLoad()" onbeforeunload="onBeforeUnload()">
        <div id="sipAccountSettings" >
            <div id='stunServerDiv'>
                <label>STUN server:</label>
                <input  id="stunServer"  type="text" size="40"> 
            </div>
            <div id='sipWsUrlDiv'>
                <label>SIP outbound proxy WS URL:</label>
                <input  id="sipWsUrl"  type="text" size="40"> 
            </div>
            <div id='sipDomainDiv'>
                <label>SIP Domain:</label>
                <input id="sipDomain"  type="text" size="30" value="sipasf.fr"> 
            </div>           
            <div id='sipDisplayNameDiv'>
                <label>SIP Display Name:</label>
                <input id="sipDisplayName"  type="text" size="30" value="laurent"> 
            </div>
            <div id='sipUserNameDiv'>
                <label>SIP User Name:</label>
                <input id="sipUserName"  type="text" size="30" value="9999"> 
            </div>
            <div id='sipLoginDiv'>
                <label>SIP Login:</label>
                <input id="sipLogin"   type="text" size="30" value="9999@sipasf.fr"> 
            </div>
            <div id='sipPasswordDiv'>
                <label>SIP Password:</label>
                <input id="sipPassword"   type="password" size="30" value="1234"> 
            </div>
            <div id='sipContactPhoneNumberDiv'>
                <label>SIP Contact phone number:</label>
                <input id="sipContactPhoneNumber"  type="text" size="30" value="7777"> 
            </div>
        </div>
        <div id='input'>
            <div>
                <input id='Register' class='button' type='submit' name='Register' disabled="disabled"
                       value='Register' onclick = "register();"/>
                <input id='UnRegister' class='button' type='submit' name='UnRegister'
                       value='UnRegister' disabled="disabled" onclick = "unRegister();"/>
                <input id='Call' class='button' type='submit' name='Call'
                       value='Call' disabled="disabled" onclick = "call(document.getElementById('sipContactPhoneNumber').value);"/>
                <input id='Bye' class='button' type='submit' name='Bye'
                       value='Bye' disabled="disabled" onclick = "bye();"/>
            </div>
        </div>
        <div id='media'>
            <div>
                <video id="localVideoPreview" autoplay="autoplay" style="height:100px; width:100px"></video>  
            </div>
             <div>
                <video id="remoteVideo" autoplay="autoplay" style="height:100px; width:100px"></video>  
            </div>
        </div>
    </body>
</html>